import React from 'react'
import './sidemenu.css'
import { sideMenuList } from '../mock/1.js'
import { Menu } from 'antd';
import { MailOutlined, DingtalkOutlined, GlobalOutlined, RocketOutlined, AppstoreOutlined, SettingOutlined } from '@ant-design/icons';


// 正式写菜单栏的逻辑 
class SideMenu extends React.Component {
    constructor(props) {
        super(props)
        this.state = {
            a: ''
        }
    }

    a = () => {

    }


    render() {
        return (

            <Menu mode="vertical" className='side-menu'>
                {
                    sideMenuList.map((m, index) => (
                        <Menu.SubMenu
                            key={Math.random()}
                            title={
                                <span>
                                    <RocketOutlined />
                                    {m.title}
                                </span>
                            }
                        >

                            {
                                m.subMenu.map((m2, m2index) => (
                                    <Menu.SubMenu
                                        key={Math.random()}
                                        title={
                                            <span>
                                                <DingtalkOutlined />
                                                {m2.title}
                                            </span>
                                        }
                                    >

                                        {
                                            m2.subMenu.map((m3, m3index) => (
                                                <Menu.Item
                                                    key={Math.random()}

                                                >
                                                    <span>
                                                        <GlobalOutlined />
                                                        {m3}
                                                    </span>
                                                </Menu.Item>
                                            ))
                                        }


                                    </Menu.SubMenu>
                                ))
                            }



                        </Menu.SubMenu>
                    ))
                }
            </Menu>



        )
    }


}



export default SideMenu

{/* <Menu  style={{ width: 256 }} mode="vertical">
                        <SubMenu key="sub2" icon={<AppstoreOutlined />} title="Navigation Two">
                          <SubMenu key="sub3" title="Submenu">
                            <Menu.Item key="7">Option 7</Menu.Item>
                            <Menu.Item key="8">Option 8</Menu.Item>
                          </SubMenu>
                        </SubMenu>
                     </Menu> */}










